<template>
	<view class="wrap">
		<scroll-view class="scroll-list" scroll-y="true" @scrolltolower="loadMore">
			<u-cell-group class="list" :border="false">
				<u-swipe-action  v-for="(item, index) in list" :key="item.id" :index="index" >
					<u-cell-item :borderBottom="true" style="border-bottom: 1px solid #ededed;" :arrow="false" @click="navTo('/pages/notice/noticeDetail?id=' + item.id)">
						<text slot="title" style="font-weight: 800;">{{item.msgTitle}}</text>
						<view slot="title" style="padding-top:20rpx;padding-bottom:20rpx" v-html="item.msgContent">{{item.msgContent}}</view>
						<view slot="label" style="line-height: 50rpx;">发送时间：{{item.sendDate}} </view>
						<view slot="label" style="line-height: 50rpx;">发送者：{{item.sendUserName}}</view>
					</u-cell-item>
				</u-swipe-action>
			</u-cell-group>
			<view class="loadmore" @click="loadMore">
				<u-loadmore :status="loadStatus"></u-loadmore>
			</view>
		</scroll-view>
		<!-- <view class="btn-plus" @click="navTo('form')">
			<u-icon name="plus-circle-fill" size="90" color="#3d87ff"></u-icon>
		</view> -->
	</view>
</template>
<script>
/**
 * Copyright (c) 2013-Now http://jeesite.com All rights reserved.
 */
export default {
	data() {
		return {
			query: {
				pageNo: 1,
				pageSize: 20
			},
			list: [],
			count: 0,
			loadStatus: 'loadmore',
			
		};
	},
	onLoad() {
		this.loadList();
	},
	onShow() {
		
	},
	methods: {
		loadMore() {
			this.loadStatus = "loading";
			setTimeout(() => {
				this.query.pageNo += 1;
				this.loadList();
			}, 100);
		},
		loadList() {
			this.$u.api.notice.list(this.query).then(res => {
				if (!res.list || res.list.length == 0){
					this.loadStatus = "nomore";
					return;
				}
				this.list = this.list.concat(res.list);
				this.count = res.count;
				this.query.pageNo = res.pageNo;
				this.query.pageSize = res.pageSize;
				this.loadStatus = "loadmore";
			});
		},
		
		navTo(url) {
			uni.navigateTo({
				url: url
			});
		}
		
	}
};
</script>
<style lang="scss">
page {
	background-color: #f8f8f8;
}
.btn-plus {
	position: absolute;
	bottom: 50rpx;
	right: 50rpx;
	z-index: 1;
	opacity: 0.6;
}
.btn-plus:hover {
	opacity: 1;
}
</style>
